<template>
	<el-container>
		<el-header>
			<div class="left-panel">
				<div class="right-panel-search">
					<el-input style="width: 150px;" v-model="search.keyword" placeholder="关键词" clearable></el-input>
					<el-select style="width: 120px;" v-model="search.verification_type" placeholder="认证类型" clearable>
						<el-option label="个人认证" value="personal"></el-option>
						<el-option label="企业认证" value="enterprise"></el-option>
					</el-select>
					<el-select style="width: 120px;" v-model="search.status" placeholder="审核状态" clearable>
						<el-option label="待审核" value="pending"></el-option>
						<el-option label="已通过" value="approved"></el-option>
						<el-option label="已拒绝" value="rejected"></el-option>
					</el-select>
					<el-button type="primary" icon="el-icon-search" @click="upsearch">搜索</el-button>
				</div>
			</div>
		</el-header>
		<el-main class="nopadding">
			<scTable ref="table" :apiObj="apiObj" @selection-change="selectionChange" stripe remoteSort remoteFilter>
				<el-table-column type="selection" width="50"></el-table-column>
				<el-table-column label="ID" prop="id" width="80" sortable='custom'></el-table-column>
				<el-table-column label="租户ID" prop="tenant_id" width="80" sortable='custom'></el-table-column>
				<el-table-column label="认证类型" prop="verification_type" width="100">
					<template #default="scope">
						<el-tag :type="scope.row.verification_type === 'personal' ? 'primary' : 'success'">
							{{ scope.row.verification_type === 'personal' ? '个人认证' : '企业认证' }}
						</el-tag>
					</template>
				</el-table-column>
				<el-table-column label="真实姓名" prop="real_name" width="120"></el-table-column>
				<el-table-column label="身份证号" prop="id_card" width="180">
					<template #default="scope">
						<span>{{ scope.row.id_card ? scope.row.id_card.replace(/(\d{6})\d{8}(\d{4})/, '$1****$2') : '-' }}</span>
					</template>
				</el-table-column>
				<el-table-column label="公司名称" prop="company_name" width="200">
					<template #default="scope">
						<span>{{ scope.row.company_name || '-' }}</span>
					</template>
				</el-table-column>
				<el-table-column label="法人代表" prop="legal_person" width="120">
					<template #default="scope">
						<span>{{ scope.row.legal_person || '-' }}</span>
					</template>
				</el-table-column>
				<el-table-column label="联系电话" prop="contact_phone" width="150"></el-table-column>
				<el-table-column label="联系地址" prop="contact_address" width="200">
					<template #default="scope">
						<span>{{ scope.row.contact_address || '-' }}</span>
					</template>
				</el-table-column>
				<el-table-column label="审核状态" prop="status" width="100">
					<template #default="scope">
						<el-tag :type="getStatusType(scope.row.status)">
							{{ getStatusText(scope.row.status) }}
						</el-tag>
					</template>
				</el-table-column>
				<el-table-column label="创建时间" prop="created_at" width="170"></el-table-column>
				<el-table-column label="操作" fixed="right" align="right" width="200">
					<template #default="scope">
						<el-button-group>
							<el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
							<el-button text type="primary" size="small" @click="table_audit(scope.row, scope.$index)" v-if="scope.row.status === 'pending'">审核</el-button>
							<el-button text type="success" size="small" @click="table_approve(scope.row, scope.$index)" v-if="scope.row.status === 'pending'">通过</el-button>
							<el-button text type="warning" size="small" @click="table_reject(scope.row, scope.$index)" v-if="scope.row.status === 'pending'">拒绝</el-button>
						</el-button-group>
					</template>
				</el-table-column>
			</scTable>
		</el-main>
	</el-container>

	<detail-dialog v-if="dialog.detail" ref="detailDialog" @closed="dialog.detail=false"></detail-dialog>
	<audit-dialog v-if="dialog.audit" ref="auditDialog" @success="handleSuccess" @closed="dialog.audit=false"></audit-dialog>
</template>

<script>
	import detailDialog from './verificationDetail'
	import auditDialog from './verificationAudit'

	export default {
		name: 'verification',
		components: {
			detailDialog,
			auditDialog
		},
		data() {
			return {
				dialog: {
					detail: false,
					audit: false
				},
				apiObj: this.$API.system.auditVerification.list||[],
				selection: [],
				search: {
					keyword: '',
					verification_type: '',
					status: ''
				}
			}
		},
		mounted() {
			this.getInit()
		},
		methods: {
			async getInit() {
				// 初始化数据
			},
			//查看
			table_show(row){
				this.dialog.detail = true
				this.$nextTick(() => {
					this.$refs.detailDialog.open(row)
				})
			},
			//审核
			table_audit(row){
				this.dialog.audit = true
				this.$nextTick(() => {
					this.$refs.auditDialog.open().setData(row)
				})
			},
			//通过
			async table_approve(row){
				try {
					await this.$confirm('确定要通过该实名认证吗？', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'success'
					})
					
					const res = await this.$API.system.auditVerification.audit.post({
						verification_id: row.id.toString(),
						status: 'approved',
						remark: '快速通过'
					})
					
					if(res.code == 200){
						this.$message.success("操作成功")
						row.status = 'approved'
					}else{
						this.$alert(res.message, "提示", {type: 'error'})
					}
				} catch (error) {
					// 用户取消操作
				}
			},
			//拒绝
			async table_reject(row){
				try {
					await this.$confirm('确定要拒绝该实名认证吗？', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					})
					
					const res = await this.$API.system.auditVerification.audit.post({
						verification_id: row.id.toString(),
						status: 'rejected',
						remark: '快速拒绝'
					})
					
					if(res.code == 200){
						this.$message.success("操作成功")
						row.status = 'rejected'
					}else{
						this.$alert(res.message, "提示", {type: 'error'})
					}
				} catch (error) {
					// 用户取消操作
				}
			},
			//表格选择后回调事件
			selectionChange(selection){
				this.selection = selection;
			},
			//搜索
			upsearch(){
				let search = JSON.parse(JSON.stringify(this.search))
				this.$refs.table.upData(search)
			},
			//本地更新数据
			handleSuccess(data, mode){
				if(mode=='audit'){
					this.$refs.table.reload()
				}
			},
			//获取状态类型
			getStatusType(status) {
				const statusMap = {
					'pending': 'warning',
					'approved': 'success',
					'rejected': 'danger'
				}
				return statusMap[status] || 'info'
			},
			//获取状态文本
			getStatusText(status) {
				const statusMap = {
					'pending': '待审核',
					'approved': '已通过',
					'rejected': '已拒绝'
				}
				return statusMap[status] || '未知'
			}
		}
	}
</script>

<style>

</style>
